{% extends "base.html" %}
{% block title %}填写申请单号{% endblock %}
{% block head %}
    {{ super() }}
    <style>
        #searchType {
            margin: 5px;
        }

        .weui-search {
            margin: 15px;
        }

        .weui-btn_mini {
            margin: 10px;
        }

        .weui-search-bar__box .weui-icon-search {
            top: 4px;
            line-height: 2em;
        }

        .weui-search-bar__box .weui-search-bar__input {
            height: 2em;
            line-height: 2em;
        }

        .weui-search-bar__form {
            background-color: unset;
        }

        .weui-search-bar__form:after {
            border-radius: 40px;
        }

        .searchHistory {
            margin: 5px 15px;
        }

        .hisText {
            margin: 5px;
        }
    </style>
{% endblock %}
{% block body %}
    <div class="contianer info-page" style="display: flex;flex-direction: column;">

        <div id="searchType">
            <button type="button" class="weui-btn weui-btn_primary weui-btn_mini selected" value="0">患者ID</button>
            <button type="button" class="weui-btn weui-btn_primary weui-btn_mini" value="1">门诊号</button>
            <button type="button" class="weui-btn weui-btn_primary weui-btn_mini" value="2">住院号</button>
            <button type="button" class="weui-btn weui-btn_primary weui-btn_mini" value="7">申请单号</button>
            <button type="button" class="weui-btn weui-btn_primary weui-btn_mini" value="8">预约号</button>
        </div>
        <div class="weui-search">
            <div class="weui-search-bar__form">
                <div class="weui-search-bar__box">
                    <i class="weui-icon-search"></i>
                    <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
                </div>
            </div>
        </div>
        <div class="#searchHistory">
            <div>搜索历史</div>
            <div id="searchHistory">
            </div>
        </div>
    </div>
{% endblock %}
{% block script %}
    {{ super() }}
    <script type="text/javascript">
        $(function () {
            var searchs = localStorage.getItem("searchs");
            if (searchs) {
                searchs = searchs.split(",");
                for (var i in searchs) {
                    var item = $('<span class="hisText">' + searchs[i] + '</span>');
                    $("#searchHistory").append(item);
                }
            }
            $("#searchType>button").click(function () {
                $(this).siblings(".selected").removeClass("selected");
                $(this).addClass("selected");
            })
            $("#searchInput").bind("keydown", function (event) {
                if (event.keyCode == 13) {
                    var search_id = event.target.value;
                    var search_type = $("#searchType>button.selected").val();
                    var searchs = localStorage.getItem("searchs");
                    if (searchs) {
                        localStorage.setItem("searchs", searchs + "," + search_id);
                    } else {
                        localStorage.setItem("searchs", search_id);
                    }
                    location.href = navRoot + "?user_id=" + search_id + "&type=" + search_type;
                }
            })
        })
    </script>
{% endblock %}